<template>
  <div class="download">
    <span class="logo"></span>
    <div class="introduce">
      <p>人人矿场</p>
<!--      <p>全球云算力资产管理平台</p>-->
      <p>全球去中心化算力资产管理及交易平台</p>
    </div>
    <a :href="downloadUrl" class="godown">立即下载</a>
  </div>
</template>
<script>
  export default {
    name: "DownLoad",
    introduce:'下载区域封装',
    data(){
      return{
        downloadUrl : this.$store.state.downloadUrl
      }
    },
    // mounted() {
    //   if()
    // },
    watch:{
      '$store.state.downloadUrl'( url ){
        this.downloadUrl = url;
      }
    }
  }
</script>
<style scoped>
  .download{background: #fff;padding:0.3rem;box-sizing: border-box;position: fixed;width: 100%;bottom: 0;left: 0;z-index: 4;overflow: hidden;border-top: 0.01rem solid#F5F5F5;}
  .download .logo{width: .72rem;height: .72rem;display: inline-block;border-radius: 0.15rem;background: url("../common/imgs/logojpg.png") center center no-repeat;
    background-size: 100% 100%;overflow: hidden;float: left}
  .introduce{font-size: .24rem;font-family: PingFang-SC-Medium;color: #C2A16F;padding-left: 0.14rem;float: left}
  .introduce>p:first-child{font-size: 0.3rem;text-align: left;}
  .introduce>p:last-child{position: absolute;bottom: 0.3rem;left: 1.16rem}
  .godown{height: 100%;display: inline-block;float: right;background: #FFD203;text-align: center;line-height: .72rem;width: 1.5rem;font-family: PingFang-SC-Medium;font-size: 0.26rem}
  .godown,.godown:active,.godown:link,.godown:visited,.godown:hover{color: #262626;border-radius: 0.04rem;}
  @media screen and (min-width: 1025px) {  .download {width: 600px;left: 50%;margin-left: -300px;}  }
</style>
